<template>
  <div id="app">
    <!-- <keep-alive> -->
        <!-- <router-view style="padding-bottom:50px" v-if="$route.meta.keepAlive"> -->
            <!-- 这里是会被缓存的视图组件，比如 Home！ -->
        <!-- </router-view> -->
    <!-- </keep-alive> -->
    <router-view v-wechat-title='$route.meta.title' style="padding-bottom:50px" />
    <FooterGuide v-show="$route.meta.showFooter"></FooterGuide>
  </div>
</template>

<script>
import FooterGuide from './components/FooterGuide/FooterGuide.vue'
export default {
  name: 'App',
  // 处理页面刷新store数据清空的问题
  created(){
    //在页面加载时读取localStorage里的状态信息
    if (localStorage.getItem("store") ) {
      this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(localStorage.getItem("store"))))
    } 
    //在页面刷新时将vuex里的信息保存到localStorage里
    window.addEventListener("beforeunload",()=>{
      localStorage.setItem("store",JSON.stringify(this.$store.state))
    })
  },
  components:{
    FooterGuide
  }
}
</script>

<style lang="stylus" rel="stylesheet/stylus">
  #app
    width 100%
    height 100%
    background #f5f5f5
</style>
